// composables/usePageTitle.ts

import { ref, onMounted, onBeforeUnmount, watchEffect } from 'vue'
export function usePageTitle(title) {
  const NAME = '-blog'
  const pageTitle = ref(document.title)
  const initialTitle = ref(title)

  watchEffect(() => {
    document.title = initialTitle?.value.title + NAME
  })

  const setPageTitle = (newTitle: string) => {
    document.title = newTitle + NAME
    if (!title) {
      return
    }
    pageTitle.value = newTitle + NAME
  }

  const resetTitle = () => {
    document.title = initialTitle.value
    pageTitle.value = initialTitle.value
  }

  onMounted(() => {
    setPageTitle(initialTitle.value)
  })

  onBeforeUnmount(() => {
    setPageTitle(initialTitle.value)
  })
  return {
    pageTitle,
    setPageTitle,
    resetTitle
  }
}
